<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8"/>
		<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
		<title>我的订单</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="renderer" content="webkit"/>
		<meta http-equiv="Cache-Control" content="no-siteapp"/>
		<meta name="apple-mobile-web-app-title" content="移动端描述内容"/>
		<link rel="icon" type="image/png" href="/assets/common/i/favicon.ico"/>
		
		<link rel="stylesheet" href="/assets/perpageres/vant.min.css"/>
		<script src="/assets/perpageres/vue.min.js"></script>
		<script src="/assets/perpageres/vant.min.js"></script>
		<script src="/assets/perpageres/zepto.min.js"></script>
		
		<script src="//at.alicdn.com/t/font_783249_e5yrsf08rap.js"></script>
		<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
		<style>
			.van-popup--center{
				width:100% !important;
				height:100% !important;
			}
		</style>
	</head>
	
	<body style="padding:0;margin:0;background-color:#efefef;">
		
		
		<div id="VueBigBox" style="width:100%;box-sizing: border-box;">
			
			<div style="width:100%;text-align:center;height:50px;background-color:rgb(97,175,239);color:#000;font-size:16px;line-height:50px;">我的筛查订单列表</div>
			
			<div  v-if="bodyFont!=''" style="padding:20px;font-size:16px;font-weight:bold;color:#F00;text-align:center;box-sizing: border-box;background-color:#FFF;border-radius:10px;width:98%;margin:10px auto;">
				{{bodyFont}}
			</div>
			
			<div  v-if="dataList.length==0" style="padding:20px;box-sizing: border-box;background-color:#FFF;border-radius:10px;width:98%;margin:10px auto;">
				<van-empty description="无任何订单数据" />
			</div>
			<div v-if="dataList.length>0"  v-for="(item,index) in dataList" style="padding:20px;box-sizing: border-box;background-color:#FFF;border-radius:10px;width:98%;margin:10px auto;">
				<div style="display:flex;">
					<div style="width:60px;">
						<img :src="IMG(item.u_avatarUrl)" style="width:60px;height:60px;border-radius:50%;" />
					</div>
					<div style="flex:1;font-size:13px;padding-left:10px;color:#333;">
						<div style="color:#00F;font-weight:bold;">{{item.u_nickName}}</div>
						<div style="display: flex;">
							<div style="flex:1;">{{item.u_trueName}}<span v-html="item.u_sex==1 ? '男' : '女'"></span>（{{item.u_mobile}}）</div>
							<div style="width:80px;color:#F00;font-size:14px;font-weight:bold;text-align:right;">¥ {{item.r_allPrice}}</div>
						</div>
						<div style="color:#666;">地址：{{item.u_address}}</div>
						<div style="color:#666;font-weight:bold;font-size:14px;">{{item.u_project}}</div>
						<div style="display: flex;padding-top:10px;">
							<div>
								<span style="color:#0F0;font-weight:bold;" v-if="item.r_payState==8">已支付</span>
								<span style="color:#F00;font-weight:bold;" v-if="item.r_payState!=8">未支付</span>
								<span style="color:#D5B391;font-weight:bold;" v-if="item.r_payType==1">会员通道</span>
								<span style="color:#D5B391;font-weight:bold;" v-if="item.r_payType==2">线上支付</span>
								<br><span style="padding-top:5px;">{{item.r_sendGiftTime}}</span>
							</div>
							<div style="flex:1;text-align:right;color:#333;font-weight:bold;">
								<div v-if="item.r_state==10"><van-button size="small" type="warning" color="#D5B391" @click="toPay(item)">立即支付</van-button></div>
								<div v-if="item.r_state==20">未使用</div>
								<div v-if="item.r_state==60">使用中</div>
								<div v-if="item.r_state==80">已到院</div>
							</div>
						</div>
					</div>
				</div>
			</div>

		</div>
	</body>
</html>

<script type="text/javascript">
	
/*dataList: #{:json_encode($myList)}#,*/
var tipFont = "#{$other.tipFont}#";

if($.trim(tipFont)!=""){
	vant.Dialog.alert({message: tipFont})
}
			var vue = new Vue({
				el: '#VueBigBox',
				data: {
					test: 123456,
					show: false,
					bodyFont: "#{$other.bodyFont}#",
					title: "",
					nowerImg: '',
					ajaxisRunning: false,
					dataList: #{:json_encode($myList)}#,
					jsApiParameters: null,
					orderInfo: null
				},
				methods: {
					jsApiCall() {
					var jsApiParameters = this.jsApiParameters;
					WeixinJSBridge.invoke(
						'getBrandWCPayRequest',
						jsApiParameters,
						function(res) {
						WeixinJSBridge.log(res.err_msg);
						if (res.err_msg == "get_brand_wcpay_request:ok") {
							// 支付成功
							vant.Dialog.alert('支付成功').then(() => {
							// 点击确定按钮后执行的回调函数
							location.reload();
							}).catch(() => {
							// 点击取消按钮后执行的回调函数
							location.reload();
							});
						} else if (res.err_msg == "get_brand_wcpay_request:cancel") {
							vant.Toast('取消支付');
						} else {
							vant.Toast('取消支付');
						}
						}
					);
					},
					callpay() {
					if (typeof WeixinJSBridge == "undefined") {
						if (document.addEventListener) {
						document.addEventListener('WeixinJSBridgeReady', this.jsApiCall, false);
						} else if (document.attachEvent) {
						document.attachEvent('WeixinJSBridgeReady', this.jsApiCall);
						document.attachEvent('onWeixinJSBridgeReady', this.jsApiCall);
						}
					} else {
						this.jsApiCall();
					}
					},
					IMG(src) {
						var back = src != "" ? src : '/assets/store/img/dealer/avatar.png';
						return back;
					},
					toPay(item) {
						// 发送数据请求
						if (this.ajaxisRunning == true) {
							vant.Toast('请勿重复点击');
						}
						
						
						window.location.href = '/mobile/perpage/pay?r_id='+item.r_id;
						/*
						var self = this; // 保存this的引用，以便在回调函数中使用
						$.post('/index.php/mobile/perpage/pay', {
							r_id: item.r_id,
							u_uid: item.u_uid
						}, function(res) {
							self.ajaxisRunning = false;
							if (res.code==1) {
								self.jsApiParameters = res.jsApiParameters;
								self.orderInfo = res.orderInfo;

								alert(res.jsApiParameters);
								//支付成功，刷新自身页面
								self.callpay();
							} else {
								vant.Dialog.alert({ message: res.msg })
							}
						});*/
					}
				}
				});


	
	// vant.Toast('成功启用vant框架');
	Vue.use(vant.Button);	// 初级组件可不用use引用
	Vue.use(vant.Switch);
	Vue.use(vant.Picker);	// 高级组件需要use引用
	Vue.use(vant.Form);
	Vue.use(vant.Field);
	Vue.use(vant.Checkbox);
	Vue.use(vant.Popup);
	Vue.use(vant.Dialog);
	Vue.use(vant.Empty);
	
	//vant.Dialog.alert({message: '弹窗内容'})
	// vant.Dialog.alert({message: '#{$other["YU"]}#'})
</script>